import React, {Component} from 'react';
import {Breadcrumb, Divider, Button, Input, message} from 'antd';
import {NavLink} from "react-router-dom";
import {connect} from "react-redux";

@connect(
    state => ({userInfo: state.userInfo})
)
class Myself extends Component {
    state = {
        name: false,
        password: false,
        tableData: {},
        formInline: {
            user: "",
            region: ""
        }
    }
    getAdmin = async () => {
        const result = await this.$axios.post("/admin/getadmin");
        if (result.data.state.type === "SUCCESS") {
            let tableData = result.data.data;
            this.setState({tableData: tableData});
        }
    }
    changeAdminUser = async () => {
        const result = await this.$axios.post("/admin/changeadminuser", this.state.tableData);
        if (result.data.state.type === "SUCCESS") {
            message.success("操作成功");
            this.getAdmin();
            this.setState({name: false, password: false});
        }
    }
    changeUser = (e) => {
        let tableData = this.state.tableData;
        tableData.nickname = e.target.value;
        this.setState({tableData: tableData});
        this.changeAdminUser();
    }
    changePassword = (e) => {
        let tableData = this.state.tableData;
        tableData.newpassword = e.target.value;
        this.setState({tableData: tableData});
        this.changeAdminUser();
    }

    componentDidMount() {
        this.getAdmin();
    }

    render() {
        const {uinfo} = this.props.userInfo
        return (
            <div>
                <div className="top">
                    <Breadcrumb>
                        <Breadcrumb.Item>
                            <NavLink to='/'>首页</NavLink>
                        </Breadcrumb.Item>
                        <Breadcrumb.Item>
                            用户管理
                        </Breadcrumb.Item>
                        <Breadcrumb.Item>
                            个人中心
                        </Breadcrumb.Item>
                    </Breadcrumb>
                </div>
                <div className="main">
                    <div className="user-info">
                        <h4 style={{marginTop: "20px", fontSize: "bold"}}>账号信息</h4>
                        <Divider/>
                        <ul className="first-userInfo">
                            <li>
                                账号 :
                                <span title="726647774@qq.com">{this.state.tableData.username}</span>
                            </li>
                            <li>
                                昵称 :
                                <span>{this.state.tableData.nickname}</span>
                                <Button type="text" size="small" style={{color: "#409EFF"}} onClick={() => {
                                    this.setState({name: true})
                                }}>修改昵称</Button>
                                {
                                    this.state.name ? (
                                        <Input
                                            defaultValue={this.state.tableData.nickname}
                                            onPressEnter={this.changeUser}
                                        ></Input>
                                    ) : null
                                }
                            </li>
                            <li>
                                账号创建时间 :
                                <span>{this.dateFormat(this.state.tableData.user_createtime)}</span>
                            </li>
                        </ul>
                        <ul>
                            <li>
                                账号状态 :
                                {
                                    this.state.tableData.user_state === '1' ?
                                        <span>启用</span> : <span>停用</span>
                                }
                            </li>
                            <li>
                                身份 :
                                {
                                    this.state.tableData.username === 'admin' ?
                                        <span style={{marginLeft: '20px'}}>超级管理员</span> :
                                        <span style={{marginLeft: '20px'}}>普通管理员</span>
                                }
                            </li>
                            <li>
                                权限 :
                                {
                                    (this.state.tableData.issh === '1' && this.state.tableData.username !== 'admin') ?
                                        <span style={{marginLeft: '20px'}}>审核中心</span> : null
                                }
                                {
                                    (this.state.tableData.isyh === '1' && this.state.tableData.username !== 'admin') ?
                                        <span style={{marginLeft: '20px'}}>用户中心</span> : null
                                }
                                {
                                    (this.state.tableData.isgl === '1' && this.state.tableData.username !== 'admin') ?
                                        <span style={{marginLeft: '20px'}}>平台管理中心</span> : null
                                }
                                {
                                    (this.state.tableData.isfk === '1' && this.state.tableData.username !== 'admin') ?
                                        <span style={{marginLeft: '20px'}}>反馈中心</span> : null
                                }
                                {
                                    this.state.tableData.username === 'admin' ?
                                        <span style={{marginLeft: '20px'}}>超级管理员拥有最高权限</span> : null
                                }
                            </li>
                        </ul>
                        <ul>
                            <li>
                                密码 :
                                <el-button type="text" size="small" style={{color: "#409EFF"}} onClick={() => {
                                    this.setState({password: true})
                                }}>修改密码</el-button>
                                {
                                    this.state.password ? (
                                        <Input
                                            defaultValue={this.state.tableData.newpassword}
                                            onPressEnter={this.changePassword}
                                        ></Input>
                                    ) : null
                                }
                            </li>
                        </ul>
                        <div style={{clear: 'both'}}></div>
                    </div>
                    <div>
                        <h4>职责</h4>
                        <Divider/>
                        {
                            (uinfo.jurisdiction.issh ==='1'|| uinfo.username === 'admin')?
                                <div>
                                    <span>网站内容的审核，用户评论的审核</span>
                                    <Divider/>
                                </div>:null
                        }
                        {
                            (uinfo.jurisdiction.isyh ==='1'|| uinfo.username === 'admin')?
                                <div>
                                    <span>用户的学生认证，公司认证，用户账号状态的管理</span>
                                    <Divider/>
                                </div>:null
                        }
                        {
                            (uinfo.jurisdiction.isgl==='1'|| uinfo.username === 'admin')?
                                <div>
                                    <span>网站轮播图的管理，各模块分类的管理</span>
                                    <Divider/>
                                </div>:null
                        }
                        {
                            (uinfo.jurisdiction.isfk ==='1'|| uinfo.username === 'admin')?
                                <div>
                                    <span>用户反馈信息的管理，用户举报信息的管理</span>
                                    <Divider/>
                                </div>:null
                        }
                        {
                            uinfo.username === 'admin'?
                                <div>
                                    <span>管理员账号的管理，网站内容的删除</span>
                                    <Divider/>
                                </div>:null
                        }
                        {
                            uinfo.user_state === '0'?
                                <div>
                                    <span>你的账号现在是停用状态</span>
                                    <Divider/>
                                </div>:null
                        }
                    </div>
                </div>
            </div>
        );
    }
}

export default Myself;